{% extends 'server/status/base.twig' %}
{% set active = 'queries' %}
{% block content %}
  <div class="container">
    {% if not is_data_loaded %}
      {{ t('Not enough privilege to view query statistics.')|error }}
    {% else %}
      <h3>
        {{ t('Questions since startup:', notes = 'Questions is the name of a MySQL Status variable') }} {{ format_number(stats.total, 0) }}
        {{ show_mysql_docu('server-status-variables', false, null, null, 'statvar_Questions') }}
      </h3>

      <div class="row">
        <ul>
          <li>{{ t('ø per hour: %s', notes = 'Average per hour')|format(format_number(stats.per_hour, 0)) }}</li>
          <li>{{ t('ø per minute: %s', notes = 'Average per minute')|format(format_number(stats.per_minute, 0)) }}</li>
          {% if stats.per_second >= 1 %}
            <li>{{ t('ø per second: %s', notes = 'Average per second')|format(format_number(stats.per_second, 0)) }}</li>
          {% endif %}
        </ul>
      </div>

      <div class="row">
        <table id="serverStatusQueriesDetails" class="table table-striped table-hover col">
          <colgroup>
            <col class="namecol">
            <col class="valuecol" span="3">
          </colgroup>

          <thead>
            <tr>
              <th scope="col">{{ t('Statements') }}</th>
              <th class="text-end" scope="col">{{ t('#', notes = '# = Amount of queries') }}</th>
              <th class="text-end" scope="col">{{ t('ø per hour', notes = 'Average per hour') }}</th>
              <th class="text-end" scope="col">%</th>
            </tr>
          </thead>

          <tbody>
            {% for query in queries %}
              <tr>
                <th scope="row">{{ query.name }}</th>
                <td class="font-monospace text-end">{{ format_number(query.value, 5, 0, true) }}</td>
                <td class="font-monospace text-end">{{ format_number(query.per_hour, 4, 1, true) }}</td>
                <td class="font-monospace text-end">{{ format_number(query.percentage, 0, 2) }}</td>
              </tr>
            {% endfor %}
          </tbody>
        </table>

        <div class="col">
          <canvas id="query-statistics-chart" data-chart-data="{{ chart_data|json_encode|e('html_attr') }}" aria-label="{{ t('Pie chart with the most frequent statements.') }}" role="img"></canvas>
        </div>
      </div>
    {% endif %}
  </div>
{% endblock %}
